<template>
  <!--提交订单页面-->
  <div>
    <wv-panel v-if="categoryCode=='vipcard_1' || categoryCode=='vipcard_2'">
      <wv-media-box :thumb="goods.coverImg | imgPathFilter" :title="goods.goodsName"
                    :description="goods.goodsPrice+'元'"></wv-media-box>
    </wv-panel>
    <wv-panel v-else>
      <wv-media-box v-if="isOld" :thumb="goods.coverImg | imgPathFilter" :title="goods.goodsName"
                    :description="goods.vipPrice+'元'"></wv-media-box>
      <wv-media-box v-else :thumb="goods.coverImg | imgPathFilter" :title="goods.goodsName"
                    :description="goods.goodsPrice+'元'"></wv-media-box>
    </wv-panel>
    <div class="divider"></div>
    <wv-group>
      <wv-cell title="数量" value="1" v-if="goods.isLimitNumber==1" v-model="number"/>
      <wv-cell title="数量" v-if="goods.isLimitNumber==2">
        <wv-number-spinner slot="ft" :min="1" v-model="number" input-width="2em" @change="onChange"/>
      </wv-cell>
      <wv-cell title="总计" :value="resultPrice+'元'" class="total"/>
    </wv-group>
    <div class="divider"></div>
    <offer @confirm="offer" :goodsList="goodsList" :resultPrice="resultPrice" :buySource="1" :accountElesignId="accountElesignId"></offer>
  </div>
</template>

<script type="text/ecmascript-6">
import {Dialog} from 'we-vue'
import {getGoodDetail} from '../../../test/unit/http'
import {Toast} from 'we-vue'
import offer from '../offertemplate/offertemplate'

export default {
  name: 'submitorder',
  props: {},
  data() {
    return {
      src: require('../../assets/guibin.png'),
      number: 1,
      goods: {},
      goodsList: [],
      resultPrice: "",
      isOld: false,
      categoryCode: '',
      accountElesignId: ''
    };
  },
  methods: {
    onChange(val) {
      this.goodsList = [];
      let goodsPrice = this.goods.goodsPrice;
      if (this.isOld) {
        goodsPrice = this.goods.vipPrice;
        if (this.categoryCode == 'vipcard_1' || this.categoryCode == 'vipcard_2') {
          goodsPrice = this.goods.goodsPrice;
          let isContinue = this.goods.isContinue;
          let enterType = this.$route.query.enterType;
          if (isContinue == 1 & enterType == 2) {
            goodsPrice = this.goods.newPrice;
          }
        }
      }
      this.goods['goodsNum'] = val;
      this.goodsList.push(this.goods);
      console.log(this.goodsList);
      let resultPrice = goodsPrice * val;
      this.resultPrice = resultPrice;
    },
    getGoodsDetail(params) {
      getGoodDetail(params).then(res => {
        console.log(res);
        if (res.code == 100) {
          this.goodsList = [];
          this.isOld = res.object.isOld;
          this.categoryCode = res.object.categoryCode;
          this.goods = res.object.goods;
          this.goods['goodsNum'] = this.number;
          this.goods['orderType'] = 1;
          this.goods['unitPrice'] = this.goods.goodsPrice;
          this.resultPrice = this.goods.goodsPrice;
          if (this.categoryCode == 'vipcard_1' || this.categoryCode == 'vipcard_2') {
            this.goods['orderType'] = 1;
          }
          if (this.categoryCode == 'viproom') {
            if (this.goods.isAppoint == 2) {
              this.goods['orderType'] = 2;
            }
          }
          if (this.categoryCode == 'viponly') {
            if (this.goods.isAppoint == 2) {
              this.goods['orderType'] = 3;
            }
          }
          if (this.categoryCode == 'insurance') {
            this.goods['orderType'] = 4;
          }
          if (this.isOld) {
            this.resultPrice = this.goods.vipPrice;
            this.goods['unitPrice'] = this.goods.vipPrice;
            if (this.categoryCode == 'vipcard_1' || this.categoryCode == 'vipcard_2') {
              this.resultPrice = this.goods.goodsPrice;
              this.goods['unitPrice'] = this.goods.goodsPrice;
              let isContinue = this.goods.isContinue;
              let enterType = this.$route.query.enterType;
              if (isContinue == 1 & enterType == 2) {
                this.resultPrice = this.goods.newPrice;
                this.goods['unitPrice'] = this.goods.newPrice;
                this.goods['goodsPrice'] = this.goods.newPrice;
              }
            }
          }
          this.goodsList.push(this.goods);
        } else {
          Toast.fail(res.info);
          this.$router.go(-1);
        }
      })
    },
    offer(payType) {
      if (payType == '线下支付') {
        this.$router.push({
          path: '/downloadoffer'
        })
      } else {
        Dialog.confirm({
          title: '是否取消支付吗？',
          message: '',
          confirmButtonText: '继续支付',
          cancelButtonText: '取消支付'
        }).then(() => {
          // 处理支付逻辑  this.$router.push({ path: '/offersuccess'})

        }).catch(() => {
          // this.$router.go(-1);
        })
      }
    }

  },
  created() {
    let goodsId = this.$route.query.goodsId;
    let enterType = this.$route.query.enterType;
    let accountElesignId = this.$route.query.accountElesignId;
    this.accountElesignId = accountElesignId;
    let params = {goodsId: goodsId, enterType: enterType};
    this.getGoodsDetail(params);
  },
  components: {
    offer
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="less" rel="stylesheet/less">
.divider {
  height: 10px;
  background-color: #eee;
}
</style>
